import 'package:flutter/material.dart';

//ListView列表组件
void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: HomePage());
  }
}

// class HomePage extends StatelessWidget {
//   int countNumber = 0;
//   HomePage({super.key});

//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       appBar: AppBar(
//         title: Text('StatelessWidget有状态组件'),
//         backgroundColor: const Color.fromARGB(255, 2, 209, 154),
//       ),
//       body: Center(
//         child: Column(
//           mainAxisAlignment: MainAxisAlignment.center,
//           children: [
//             Text('实现一个计数器的功能', style: TextStyle(fontSize: 20)),
//             SizedBox(height: 100),
//             Text(
//               '当前计数:$countNumber',
//               style: Theme.of(context).textTheme.headlineMedium,
//             ),
//             SizedBox(height: 100),
//             ElevatedButton(
//               onPressed: () {
//                 countNumber++;
//                 print(countNumber);
//               },
//               child: Text('增加'),
//             ),
//           ],
//         ),
//       ),
//     );
//   }
// }

//有状态组件: 如果我们想改变页面中的数据的话这个时候就需要用到StatefulWidget
class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<HomePage> {
  int countNumber = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('有状态组件'),
        backgroundColor: const Color.fromARGB(255, 2, 209, 154),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              '计数器:$countNumber ',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                // 更新状态
                setState(() {
                  countNumber++;
                });
              },
              child: Text('增加'),
            ),
          ],
        ),
      ),
      // 浮动操作按钮
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // 更新状态
          setState(() {
            countNumber++;
          });
        },
        child: Icon(Icons.add),
      ),
    );
  }
}
